﻿<template>
    <div class="l-rblock l-form-viewer" style="padding:8px;">
        <el-form
            :model="formData"
            :rules="rules"
            size="mini"
            labelPosition="right"
            labelWidth="80px"
            ref="form"
            >
            <div class="l-auto-window only-tabs">
                <el-tabs v-model="activeName" type="card">
                    <el-tab-pane class="l-tabs-container" :label="$t('主表信息')" name="tab0">
                        <el-row :gutter="0">
                            <div class="l-rblock">
                                <el-col v-if="lr_formLookAuth('f_FullHead')" :span="24" >
                                    <el-form-item 
                                        label="新闻标题" 
                                        prop="f_FullHead"
                                        :required="true"
                                        > 
                                        <el-input v-model="formData.f_FullHead" :placeholder="$t('请输入')" >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('f_CategoryId')" :span="12" >
                                    <el-form-item 
                                        label="新闻栏目" 
                                        prop="f_CategoryId"
                                        :required="true"
                                        > 
                                        <l-select :options="f_CategoryOptions" v-model="formData.f_CategoryId" ></l-select>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('f_ReleaseTime')" :span="12" >
                                    <el-form-item 
                                        label="发布时间" 
                                        prop="f_ReleaseTime"
                                        :required="true"
                                        > 
                                        <l-date format="yyyy-MM-dd HH:mm:ss" dateType="datetime" :clearable="true" v-model="formData.f_ReleaseTime" :placeholder="$t('请选择')" >
                                        </l-date>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('f_AuthorName')" :span="12" >
                                    <el-form-item 
                                        label="作者" 
                                        prop="f_AuthorName"
                                        :required="true"
                                        > 
                                        <el-input v-model="formData.f_AuthorName" :placeholder="$t('请输入')" >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('f_CompileName')" :span="12" >
                                    <el-form-item 
                                        label="编辑" 
                                        prop="f_CompileName"
                                        :required="true"
                                        > 
                                        <el-input v-model="formData.f_CompileName" :placeholder="$t('请输入编辑人员')" >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('f_TagWord')" :span="12" >
                                    <el-form-item 
                                        label="Tag标签" 
                                        prop="f_TagWord"
                                        > 
                                        <el-input v-model="formData.f_TagWord" :placeholder="$t('多个标签用“,”分隔，最多不超过10个')" >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('f_Keyword')" :span="12" >
                                    <el-form-item 
                                        label="关键字" 
                                        prop="f_Keyword"
                                        > 
                                        <el-input v-model="formData.f_Keyword" :placeholder="$t('多个关键字用“,”分隔，最多不超过10个')" >
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('f_NewsContent')" :span="24" >
                                    <el-form-item 
                                        label="内容" 
                                        prop="f_NewsContent"
                                        > 
                                        <l-editor style="height:250px;" v-model="formData.f_NewsContent" :options="{ theme:'snow',placeholder: $t('请输入内容...')}" :rows="15" ></l-editor>
                                    </el-form-item>
                                </el-col>
                            </div>
                        </el-row>
                    </el-tab-pane>
                </el-tabs>
            </div>
        </el-form>
    </div>
</template>
<script>
export default {
    data(){
        return {
            activeName: 'tab0',
            formData: {
                f_CategoryId:"", // 新闻栏目
                f_FullHead:"", // 新闻标题
                f_ReleaseTime:"", // 发布时间
                f_AuthorName:"", // 作者
                f_CompileName:"", // 编辑
                f_TagWord:"", // Tag标签
                f_Keyword:"", // 关键字
                f_NewsContent:"", // 内容
            },
            rules: {
                 f_FullHead: [{ required: true, message: '请输入新闻名称' },],
                 f_CategoryId: [{ required: true, message: '请输入新闻栏目' },],
                 f_ReleaseTime: [{ required: true, message: '请输入发布时间'},],
                 f_AuthorName: [{ required: true, message: '请输入作者'},],
                 f_CompileName: [{ required: true, message: '请输入编辑人员' },],
            },
        };
    },
    computed: {
        f_CategoryOptions(){
            return [{"value":"1","label":"国内新闻"},
                    {"value":"2","label":"国际新闻"},
                    {"value":"3","label":"社会新闻"},
                    {"label":"体育新闻","value":'4'},
                    {"label":"娱乐新闻","value":'5'},
                    {"label":"科技新闻","value":'6'},
                    {"label":"行业趣闻","value":'7'},
                    {"label":"其他新闻","value":'8'}]
        },
    },
    mounted() {
    },
    methods: {        
        // 重置表单
        resetForm() {
            this.$refs.form.resetFields()
        },
        // 校验表单
        validateForm() {
            return new Promise((resolve) => {
                this.$refs.form.validate((valid) => {
                    if (valid) {
                        
                        resolve(true)
                    }
                    else {
                        resolve(false)
                    }
                })
            })
            
        },
        // 设置表单数据
        setForm(data) {
            this.formData = data 
        },
        // 获取表单数据
        getForm() {
            return this.$deepClone(this.formData)
        }
    }
}
</script>